// 补签合同报表
<template>
    <div class="wrap">

        <Row class="noRepor" v-if="retroaciveDataType">
            <div>
                <p>当前月份还未生成报表</p>
                <Button type="primary" @click="toCostReportTime">点击生成</Button>
            </div>
        </Row>
        <Row class="reporBox" v-else>
            <Row class="reporHeader">
                <h3>平台补签合同报表</h3>
                <Col span="12">报表统计月份：{{ dataList[0] ? dataList[0].statistics_date : '' }}</Col>
                <Col class="textRight" span="12" >报表生成日期：{{ dataList[0] ? dataList[0].createdDt : '' }}</Col>
            </Row>
            <Table :columns="column" :data="dataList" border></Table>
            <div class="remark">
                <div>备注：</div>
                <div>
                    <div>核销金额=当月补签合同核销订单金额</div>
                    <div>平台服务费=SUM(当月补签合同核销订单金额*佣金率)</div>
                    <div>结算价格=SUM当月补签合同核销金额数据对应的结算价格</div>
                    <div>不含税成本=SUM[补签合同结算价格/（订单所属税率+1）]</div>
                    <div>税额=结算价格-不含税成本</div>
                </div>
            </div>
        </Row>

    </div>
</template>

<script>
import {
    Button,
    DatePicker,
    Row,
    Col,
    Table,
} from "view-design";
import Authc from "@/components/Authc";
import util from '@/utils/util'
export default {
    name: "retroactiveContractReport",
    components: {
        Button,
        Row,
        Col,
        Table,
        Authc,
    },
    props: {
        retroaciveData: {
            type: Array,
            default: null
        },
        retroaciveDataType: {
            type: Boolean,
            default: null
        }
    },
    data() {
        return {
            searchData: {},
            /** 表格头部配置 **/
            column: [
                {
                    title: "项目",
                    align: "center",
                    key: "project_name",
                    minWidth: 120,
                },
                {
                    title: "门票",
                    align: "center",
                    children: [
                        {
                            title: "自营",
                            key: "ticket_self",
                            minWidth: 100,
                            align: "center"

                        },
                        {
                            title: "平台",
                            key: "ticket_plat",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "清分",
                            key: "ticket_clearing",
                            minWidth: 100,
                            align: "center"
                        }
                    ]
                },
                {
                    title: "路线",
                    align: "center",
                    children: [
                        {
                            title: "自营",
                            key: "line_self",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "平台",
                            key: "line_plat",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "清分",
                            key: "line_clearing",
                            minWidth: 100,
                            align: "center"
                        }
                    ]
                },
                {
                    title: "机票",
                    align: "center",
                    children: [
                        {
                            title: "自营",
                            key: "flight_self",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "平台",
                            key: "flight_plat",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "清分",
                            key: "flight_clearing",
                            minWidth: 100,
                            align: "center"
                        }
                    ]
                },
                {
                    title: "酒店",
                    align: "center",
                    children: [
                        {
                            title: "自营",
                            key: "hotel_self",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "平台",
                            key: "hotel_plat",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "清分",
                            key: "hotel_clearing",
                            minWidth: 100,
                            align: "center"
                        }
                    ]
                },
                {
                    title: "租车",
                    align: "center",
                    children: [
                        {
                            title: "自营",
                            key: "charterer_self",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "平台",
                            key: "charterer_plat",
                            minWidth: 100,
                            align: "center"
                        },
                        {
                            title: "清分",
                            key: "charterer_clearing",
                            minWidth: 100,
                            align: "center"
                        }
                    ]
                }
            ],
            /** 表格数据**/
            dataList: []
        };
    },
    watch: {
        'retroaciveData'(val) {
            this.dataList = this.retroaciveData;
        }
    },
    created() {

    },
    methods: {
        toCostReportTime () {
            this.$emit('getCostReportTime', '1');
        },
    }
};
</script>

<style lang="less" scoped>
    .wrap {
        .noRepor {
            // text-align: center;
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 600px;
            div {
                text-align: center;
                p{
                    font-weight: bold;
                }
            }
        }
        .reporBox {
            .remark {
                display: flex;
                justify-content: left;
                background: #eee;
                max-width: 40%;
                padding: 16px;
                margin-top: 16px;
            }
        }
    }
</style>
